<template>
  <MapView
    :lng="lng"
    :lat="lat"
    :getLoaction="getLoaction"
    :show="show"
    :list="lists"
    @handleShow="handleShow"
    @handleCamera="handleCamera"
    @handleGift="handleGift"
  />
</template>
<script lang="ts">
import { UPLOAD } from '@/router/route-name';
import { useLocationMainStore, usePickStore } from '@/store';
import { computed, defineComponent, onBeforeUnmount, ref } from 'vue';
import { useRouter } from 'vue-router';
import MapView from './MapView.vue';

export default defineComponent({
  components: { MapView },
  setup() {
    const location = useLocationMainStore();
    const { getAllImage, setTimer, list } = usePickStore();
    const pickStore = usePickStore();
    const router = useRouter();
    // 初始化
    location.getLoaction();
    getAllImage();
    const lng = computed<number>(() => location.lng);
    const lat = computed<number>(() => location.lat);

    const show = ref<boolean>(false);
    const handleShow = (value: boolean) => (show.value = !value);

    const handleCamera = () => {
      //跳转上传
      router.push({ name: UPLOAD });
    };

    const handleGift = () => {
      // 跳到ar
      const origin = window.location.origin;
      // if(origin.startsWith("http://lova"))
      // https://192.168.1.101:3000
      // console.log(origin);
      if (!origin.startsWith('https://82')) {
        // 本地
        const url = `${origin}/ar.html#/`;
        window.location.href = url;
      } else {
        const url = `${origin}/ar#/`;
        window.location.href = url;
      }
    };

    const timer = setInterval(() => {
      location.getLoaction();
    }, 10000);

    const timer2 = setInterval(() => {
      getAllImage();
    }, 60000);

    location.setTimer(timer as unknown as number);
    setTimer(timer2 as unknown as number);

    onBeforeUnmount(() => {
      location.setTimer(0);
      setTimer(0);
    });

    const lists = computed(() => {
      console.log('ldasd', pickStore.list);
      return pickStore.list;
    });

    return {
      getLoaction: location.getLoaction,
      lng,
      lat,
      show,
      handleShow,
      handleCamera,
      handleGift,
      lists,
    };
  },
});
</script>
<style lang="less" scoped></style>
